<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>校园生活助手 - {% block title %}{% endblock %}</title>
    <!-- 引入Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- 引入Font Awesome -->
    <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <!-- 引入Chart.js -->
    <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.8/dist/chart.umd.min.js"></script>
    <!-- 引入自定义CSS -->
    <link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
    
    {% block css %}{% endblock %}
</head>
<body>
    <!-- 导航栏 -->
    <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
        <div class="container-fluid">
            <a class="navbar-brand" href="{{ url_for('dashboard') }}">
                <i class="fa fa-graduation-cap mr-2"></i>校园生活助手
            </a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                    <!-- 课程管理 -->
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle {% if request.endpoint.startswith('courses') %}active{% endif %}" href="#" id="coursesDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                            <i class="fa fa-book mr-1"></i>课程管理
                        </a>
                        <ul class="dropdown-menu" aria-labelledby="coursesDropdown">
                            <li><a class="dropdown-item" href="{{ url_for('courses') }}">课程列表</a></li>
                            <li><a class="dropdown-item" href="{{ url_for('course_schedule') }}">课程表</a></li>
                            <li><a class="dropdown-item" href="{{ url_for('add_course') }}">添加课程</a></li>
                        </ul>
                    </li>
                    
                    <!-- 成绩追踪 -->
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle {% if request.endpoint.startswith('scores') %}active{% endif %}" href="#" id="scoresDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                            <i class="fa fa-line-chart mr-1"></i>成绩追踪
                        </a>
                        <ul class="dropdown-menu" aria-labelledby="scoresDropdown">
                            <li><a class="dropdown-item" href="{{ url_for('scores') }}">成绩列表</a></li>
                            <li><a class="dropdown-item" href="{{ url_for('add_score') }}">添加成绩</a></li>
                            <li><a class="dropdown-item" href="{{ url_for('score_analytics') }}">成绩分析</a></li>
                        </ul>
                    </li>
                    
                    <!-- 校园活动 -->
                    <li class="nav-item">
                        <a class="nav-link {% if request.endpoint.startswith('activities') %}active{% endif %}" href="{{ url_for('activities') }}">
                            <i class="fa fa-calendar mr-1"></i>校园活动
                        </a>
                    </li>
                    
                    <!-- 学习资源 -->
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle {% if request.endpoint.startswith('resources') %}active{% endif %}" href="#" id="resourcesDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                            <i class="fa fa-folder-open mr-1"></i>学习资源
                        </a>
                        <ul class="dropdown-menu" aria-labelledby="resourcesDropdown">
                            <li><a class="dropdown-item" href="{{ url_for('resources') }}">资源列表</a></li>
                            <li><a class="dropdown-item" href="{{ url_for('add_resource') }}">上传资源</a></li>
                            <li><a class="dropdown-item" href="{{ url_for('resource_collections') }}">我的收藏</a></li>
                        </ul>
                    </li>
                    
                    <!-- 社交 -->
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle {% if request.endpoint.startswith('messages') or request.endpoint.startswith('users') %}active{% endif %}" href="#" id="socialDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                            <i class="fa fa-users mr-1"></i>社交
                            {% if unread_messages_count and unread_messages_count > 0 %}
                            <span class="badge bg-danger ml-1">{{ unread_messages_count }}</span>
                            {% endif %}
                        </a>
                        <ul class="dropdown-menu" aria-labelledby="socialDropdown">
                            <li><a class="dropdown-item" href="{{ url_for('messages') }}">消息中心</a></li>
                            <li><a class="dropdown-item" href="{{ url_for('users_list') }}">同学列表</a></li>
                        </ul>
                    </li>
                </ul>
                
                <!-- 用户信息 -->
                <ul class="navbar-nav ml-auto">
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle d-flex align-items-center" href="#" id="userDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                            <img src="{{ url_for('static', filename='images/' + (current_user.avatar or 'default_avatar.png')) }}" alt="用户头像" class="rounded-circle mr-2" style="width: 32px; height: 32px;">
                            <span>{{ current_user.username }}</span>
                        </a>
                        <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="userDropdown">
                            <li><a class="dropdown-item" href="{{ url_for('profile') }}"><i class="fa fa-user mr-2"></i>个人中心</a></li>
                            <li><a class="dropdown-item" href="{{ url_for('settings') }}"><i class="fa fa-cog mr-2"></i>设置</a></li>
                            <li><hr class="dropdown-divider"></li>
                            <li><a class="dropdown-item" href="{{ url_for('logout') }}"><i class="fa fa-sign-out mr-2"></i>退出登录</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
    </nav>

    <!-- 主要内容区域 -->
    <div class="container-fluid mt-4">
        <!-- 消息提示区域 -->
        {% with messages = get_flashed_messages(with_categories=true) %}
            {% if messages %}
                {% for category, message in messages %}
                    <div class="alert alert-{{ category }} fade-in" role="alert">
                        <button type="button" class="close" data-bs-dismiss="alert" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                        {{ message }}
                    </div>
                {% endfor %}
            {% endif %}
        {% endwith %}
        
        <!-- 页面内容 -->
        {% block content %}
        {% endblock %}
    </div>

    <!-- 页脚 -->
    <footer class="footer mt-auto py-3 bg-light">
        <div class="container text-center">
            <span class="text-muted">© 2025 校园生活助手 - 让校园生活更美好</span>
        </div>
    </footer>

    <!-- 引入Bootstrap JS -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
    <!-- 引入jQuery (如果需要) -->
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
    
    {% block js %}{% endblock %}
</body>
</html>